$(function () {
    findAll();
    $("#page").load("/html/back/page.html");
});

function findAll() {
    let username = $("#username").val();
    let phone = $("#phone").val();
    let sex = $("#sex").val();
    let startBirthday = $("#startBirthday").val();
    let endBirthday = $("#endBirthday").val();
    let hobby = gethobby();
    let introduce = $("#introduce").val();
    let enable = $("#enable").val();
    let data = {
        username: username,
        phone: phone,
        sex: sex,
        startBirthday: startBirthday,
        endBirthday: endBirthday,
        hobby: JSON.stringify(hobby),
        enable: enable,
        introduce: introduce
    };
    $.ajax({
        url: "/back/user/findAll",//调用后台的地址
        type: 'get',//方法类型,查询get，其他post，post和get的区别？
        data: data,//传递到后台的数据
        dataType: "json",//后台传递到前台页面的格式json
        success: function (data) {//data后台传递到前台的数据
            setData(data.list);
        }
    })
}

function setData(data) {
    let html = '';
    console.log(data);
    for (let i = 0; i < data.length; i++) {
        html += '<div>\n' +
            '            <div>' + data[i].id + '</div>\n' +
            '            <div>' + data[i].username + '</div>\n' +
            '            <div>' + data[i].phone + '</div>\n' +
            '            <div>' + (data[i].email == undefined ? '' : data[i].email) + '</div>\n' +
            '            <div>' + data[i].sex + '</div>\n' +
            '            <div>' + data[i].birthday + '</div>\n' +
            '            <div>' + data[i].hobby + '</div>\n' +
            '            <div>' + data[i].introduce + '</div>\n' +
            // '            <div>' + (data[i].createTime == undefined ? '' : data[i].createTime) + '</div>\n' +
            '            <div>' + (data[i].enable == 1 ? "<i class='iconfont iconColorGreen'>已激活&#xe623;</i>" : "<i class='iconfont iconColorRed'>未激活&#xe61b;</i>") + '</div>\n' +
            '            <div>\n' +
            '                <div onclick="edit(' + data[i].id + ')"><i class="iconfont">&#xe626;</i></div>\n' +
            '                <div><i class="iconfont">&#xe61e;</i> </div>\n' +
            '                <div onclick="del(' + data[i].id + ')"><i class="iconfont">&#xe624;</i></div>\n' +
            '            </div>\n' +
            '        </div>';
    }
    $("#tbody").html(html);
    $("#tbody>div").children().css({"overflow": "hidden", "white-space": "nowrap"});
}

function edit(id) {
//页面之间传递值
//     localStorage
    sessionStorage.setItem("userId", id);
    // window.open("/html/back/user/userEdit.html?id=" + id);
    $(".right").load("/html/back/user/userEdit.html");
}

function del(id) {
    $.ajax({
        url: "/back/user/del",//调用后台的地址
        type: 'post',//方法类型,查询get，其他post，post和get的区别？
        data: {id: id},//传递到后台的数据
        dataType: "json",//后台传递到前台页面的格式json
        success: function (data) {//data后台传递到前台的数据
            if (data.result == 1) {
                $(".right").load("/html/back/user/userManage.html");
            }
        }
    })
}


function gethobby() {
    let hobby = [];
    $('input:checkbox[name="hobby"]').each(function () {
        if ($(this).prop('checked')) {
            hobby.push($(this).val());
        }
    });
    return hobby;
}